import axios from 'axios'
import store from '@/store/'
import router from '../router'
// 创建axios实例来配置baseURL/timeout
const instance = axios.create({
  baseURL: 'http://pcapi-xiaotuxian-front-devtest.itheima.net'
  // timeout: 5000
})

/**
 * 请求拦截器
 * 1.请求头Authorization存储token
 */
instance.interceptors.request.use(config => {
  const { token } = store.state.user.profile
  if (token) config.headers.Authorization = `Bearer ${token}`
  // 添加token
  return config
}, e => Promise.reject(e))

/**
 * 响应拦截器
 * 404情况
 * 1.token过期携带当前页路径跳转到登录页面
 */
instance.interceptors.response.use(
  res => {
    return res.data
  }, err => {
    if (err.response && err.response.status === 401) {
      // 在vue3.0中currentRouter要加.value
      // 1. URL 传参的时候，如果参数中有空格等特殊字符，浏览器可能只会读取到空格前的内容，导部分致数据丢失，我们使用encodeURIComponent方法进行编码，避免参数错误
      const redirectUrl = encodeURIComponent(router.currentRoute.value.fullPath)
      // const redirectUrl = router.currentRoute.value.fullPath
      // 跳转到登录页
      router.replace(`/login?redirectUrl=${redirectUrl}`)
      store.dispatch('user/logout') // 清除vuex里的个人数据
    }
    return Promise.reject(err)// 驳回错误
  }
)
// 二次封装

/**
 *
 * @param {*} url string 请求地址
 * @param {*} method String 请求方式
 * @param {*} submitData Object 请求数据
 * @returns  promise对象
 */
const request = (url, method, data) => {
  return instance({
    url,
    method,
    // 用 [动态填写对象属性]
    [method.toLowerCase() === 'get' ? 'params' : 'data']: data
    // ['age']:18  // 对象本身就可以这样定义
  })
}
export default request
